<template>
  <section>
    <el-table :data="jobList">
      <el-table-column type="index" label="序号"/>
      <el-table-column label="任务类型" prop="jobType.name"></el-table-column>
      <el-table-column label="详情">
        <template slot-scope="scope">
          {{scope.row.data.title}}
        </template>
      </el-table-column>
      <el-table-column label="标记" prop="mark"></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button v-if="scope.row.state === 1" size="mini" type="primary" @click="toToJobBtn(scope.row)">执行</el-button>
          <span v-else-if="scope.row.state === 2">执行中……</span>
          <span v-else-if="scope.row.state === 3">已完成</span>
          <span v-else-if="scope.row.state === 4">已取消</span>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination v-show="totalPage>0" style="margin-top:10px;"
                   background
                   layout="prev, pager, next"
                   :page-count="totalPage"
                   @current-change="goPage">
    </el-pagination>
    <el-dialog :visible.sync="dialog">
      之前用来生成体检，已修改，待整理
    </el-dialog>
  </section>
</template>

<script>
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import errHandler from '@/assets/errHandler.js'
  export default {
    name: "jobList",
    data() {
      return {
        jobList:null,
        totalPage:0,
        dialog:false,
        currJob:null,
        currJobType:'',
      }
    },
    created(){
      //获取任务列表
      this.getJobList()
    },
    watch:{
    },
    computed:{
      ...mapGetters(['department']),
    },
    methods: {
      ...mapActions({
        fetch: 'fetch'
      }),
      goPage(val){
        this.getJobList(val-1)
      },
      getJobList(pageNo){
        this.fetch({name:"getJobList",data:{page:pageNo?pageNo:0,departmentId:this.department.id}})
          .then(res=>{
            console.log(res.content)
            this.jobList=res.content
            this.totalPage=res.totalPages
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      toToJobBtn(row){
        console.log(row)
        this.currJob=row
        if(row.jobTypeCode === 'course'){
          this.createLearnerByJob(row.id)
        }
      },
      createLearnerByJob(jobId){
        this.fetch({name:"createLearnerByJob",data:{jobId}})
          .then(res=>{
            console.log(res)
            this.$message({message: '导入成功！',type: 'success'})
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
    }
  }
</script>

<style scoped>

</style>
